<template>
  <div>
    <div class="select_top">
      <el-input @keyup.native.enter="getsortList" placeholder="请输入单位名称" style="width:29%;margin-right:10px" v-model="query"></el-input>
      <el-button @click="getsortList">搜索</el-button>
      <el-button style="float:right" type="primary" @click="newSort">新增</el-button>
    </div>
    <el-table
      ref="filterTable"
      :data="sortList"
      style="width: 92%;font-size:13px;margin: 20px auto"
    >
      <el-table-column
        type="index"
        width="50"
        label="序号"
      >
      </el-table-column>
      <el-table-column
        prop="hash.gname"
        label="等次名称"
      >
      </el-table-column>
      <el-table-column
        prop="hash.gvalue"
        label="加减分"
      >
      </el-table-column>
      <el-table-column
        prop="hash.orgtype"
        label="评议对象类型"
      >
        <template slot-scope="scope">
          <span v-if="scope.row.hash.orgtype=== '1'">牵头部门</span>
          <span v-else>协同部门</span>
        </template>
      </el-table-column>
      <el-table-column
        label="操作"
        width="200"
      >
        <template slot-scope="scope">
          <el-button
            type="primary"
            size="small"
            @click="changeSort(scope.row)"
          >
            编辑
          </el-button>
          <el-button
            type="primary"
            size="small"
            @click="deleteSort(scope.row)"
          >
            删除
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <!-- <el-pagination
      @current-change="handleCurrentChange"
      :currentPage.sync="currentPage3"
      :pageSize="pagesize"
      layout="prev, pager, next, jumper"
      :total="total"
      style="text-align:center"
    >
    </el-pagination> -->
    <el-dialog
      title="新增等次"
      :visible.sync="showSort"
      width="40%"
    >
      <el-form labelWidth="100px">
        <el-form-item label="等次名称">
          <el-input v-model="gname" v-validate="'required'" name="等次名称"></el-input>
          <div class="el-form-item__error">{{ errors.first('等次名称') }}</div>
        </el-form-item>
        <el-form-item label="加减分">
          <el-input v-model="gvalue" v-validate="'required'" name="加减分" type="number"></el-input>
          <div class="el-form-item__error">{{ errors.first('加减分') }}</div>
        </el-form-item>
        <el-form-item label="评议对象类型">
          <el-select v-model="orgtype" placeholder="请选择" style="width:100%" v-validate="'required'"
            name="评议对象类型"
          >
            <el-option
              v-for="(item,index) in orgtypeList"
              :key="index"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
          <div class="el-form-item__error">{{ errors.first('评议对象类型') }}</div>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="showSort = false">取 消</el-button>
        <el-button type="primary" @click="savenewSort">新 增 </el-button>
      </span>
    </el-dialog>


    <el-dialog
      title="编辑等次"
      :visible.sync="showSort2"
      width="40%"
    >
      <el-form labelWidth="100px">
        <el-form-item label="等次名称">
          <el-input v-model="sortData.gname" v-validate="'required'" name="等次名称"></el-input>
          <div class="el-form-item__error">{{ errors.first('等次名称') }}</div>
        </el-form-item>
        <el-form-item label="加减分">
          <el-input v-model="sortData.gvalue" v-validate="'required'" name="加减分" type="number"></el-input>
          <div class="el-form-item__error">{{ errors.first('加减分') }}</div>
        </el-form-item>
        <el-form-item label="评议对象类型">
          <el-select v-model="sortData.orgtype" placeholder="请选择" style="width:100%" v-validate="'required'"
            name="评议对象类型"
          >
            <el-option
              v-for="(item,index) in orgtypeList"
              :key="index"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
          <div class="el-form-item__error">{{ errors.first('评议对象类型') }}</div>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="showSort2 = false">取 消</el-button>
        <el-button type="primary" @click="savechangeSort">修 改</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>

export default {
  data() {
    return {
      currentPage3: 1,
      pagesize: 10,
      total: 10,
      ts: this.newStore(),
      showSort: false,
      showSort2: false,
      sortNum: '',
      query: '',
      orgtypeList: [{
        value: '1',
        label: '牵头单位',
      },
      {
        value: '4',
        label: '协同单位',
      }],
      sortList: [],
      zbSelect: [],
      sortData: {},
      nid: '',
      typename: '',
      orgtype: '',
      gname: '',
      gvalue: '',
    };
  },
  created() {
    this.getsortList();
  },
  methods: {
    // handleCurrentChange() {
    //   this.getsortList();
    // },
    savechangeSort() {
      this.$validator.validateAll().then((result) => {
        if (result) {
          const req = {
            handle: 'B37BA078041E48C7332ACDB13A842518632237C1811F5EC5',
            id: this.sortData.id,
            gname: this.sortData.gname,
            gvalue: this.sortData.gvalue,
            orgtype: this.sortData.orgtype,
          };
          this.$confirm('确定修改?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning',
          }).then(() => {
            this.spost(this.ts, '/mainservlet', req).then(() => {
              this.$message({
                type: 'success',
                message: '修改成功!',
              });
              this.getsortList();
              this.showSort2 = false;
            });
          }).catch(() => {
            this.$message({
              type: 'info',
              message: '已取消',
            });
          });
        } else {
          this.$message.error('内容不能为空！');
          return false;
        }
      });
    },
    changeSort(item) {
      this.sortData = item.hash;
      this.showSort2 = true;
    },
    newSort() {
      this.showSort = true;
    },
    deleteSort(item) {
      const req = {
        handle: 'B37BA078041E48C7F568A6CE28C87E073F2F1A6810CCA46ABFF0B9210751F692',
        id: item.hash.id,
      };
      this.$confirm('确定删除?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(() => {
        this.spost(this.ts, '/mainservlet', req).then(() => {
          this.$message({
            type: 'success',
            message: '删除成功!',
          });
          this.getsortList();
        });
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消',
        });
      });
    },
    savenewSort() {
      this.$validator.validateAll().then((result) => {
        if (result) {
          const req = {
            handle: 'B37BA078041E48C74E95A8D2219E38CBFCD9120CF5AFF5FA',
            gname: this.gname,
            gvalue: this.gvalue,
            orgtype: this.orgtype,

          };
          this.spost(this.ts, '/mainservlet', req).then(() => {
            this.$message({
              type: 'success',
              message: '添加成功!',
            });
            this.getsortList();
            this.showSort = false;
          });
        } else {
          this.$message.error('内容不能为空！');
          return false;
        }
      });
    },
    getsortList() {
      const req = {
        handle: 'B37BA078041E48C77490C04E14B08D6128A1B50ACE714F29BFF0B9210751F692',
        query: this.query,
      };
      this.spost(this.ts, '/mainservlet', req).then((ts) => {
        this.sortList = ts.d.data.operation1;
      });
    },
  },
};
</script>

<style lang="stylus">
.el-form-item.is-required .el-form-item__label:before
  content: '*'
  color: #f56c6c
  margin-right: 4px
.el-pagination
  margin-bottom 10%
.el-input--suffix .el-input__inner
  font-size 13px
.el-button
  font-size 13px
.el-table th>.cell
  text-align center
.el-table .cell
  text-align center
.el-select
  width 14%
  margin-right 1%
.select_top
  width 92%
  margin 20px auto
.el-col
  padding: 20px 10px;
</style>
